import html2canvas from 'html2canvas'
// 导出 excel，pdf 基础类
export class BaseExport {
  private _excelType: string = 'application/vnd.ms-excel;charset:utf-8'
  private _pdfType: string = 'application/pdf;chartset=utf-8'
  private _responseType: string = 'arraybuffer'

  /**
   * @description: 下载文件
   * @param {ArrayBuffer} data 后端数据流
   * @param {string} fileType 文件类型
   * @param {string} fileName 文件名字
   * @return {*}
   */
  downloadFile(data: ArrayBuffer, fileType: string, fileName: string) {
    const type = fileType === 'excel' ? this._excelType : this._pdfType
    const blob = new Blob([data], { type: fileType })
    if ('download' in document.createElement('a')) {
      // 非IE下载
      const elink = document.createElement('a')
      elink.download =
        fileType === 'excel' ? `${fileName}.xlsx` : `${fileName}.pdf`
      elink.style.display = 'none'
      elink.href = URL.createObjectURL(blob)

      document.body.appendChild(elink)
      elink.click()
      URL.revokeObjectURL(elink.href) // 释放URL 对象
      document.body.removeChild(elink)
    } else {
      // IE10+下载
      window.navigator.msSaveBlob(blob, fileName)
    }
  }


  /**
   * @description: 将 SVG 图片转成 png 下载
   * @param {HTMLElement} el dom 元素
   * @param {string} name 下载名字
   * @return {*}
   */
  downloadSvgToPng(el: HTMLElement, name: string) {
    html2canvas(el, {
      width: 460,
      height: 460,
      allowTaint: true,
      useCORS: true,
      x: el.offsetLeft,
      y: el.offsetTop,
      ignoreElements: (element) => {
        if (element.tagName.toLowerCase() === 'iframe') {
          return true
        }
        return false
      },
    }).then((canvas) => {
      console.log('canvas', canvas)
      const img = canvas.toDataURL('image/png', 1).replace('data:image/png;base64,', '')
      console.log(img)
      const finalImageSrc = 'data:image/png;base64,' + img
      const aElem = document.createElement('a')
      document.body.appendChild(aElem)
      aElem.href = finalImageSrc
      // 设置下载标题
      aElem.download = `${name}.png`
      aElem.click()
    })
  }


  /**
   * @description: exportTable 静态的导出表格方法
   * @param {any} tableData 表格行数据
   * @param {string} tableHeader 表格头数据
   * @param {string} name 下载名称
   * @return {*}
   */
  exportTable(tableData: any[], tableHeader: string[], name: string) {
    const headerStrList = tableHeader
    const dataArr: any[] = []
    tableData.forEach((item) => {
      const arr = [item.propertyName, item.symbol, item.data, item.unit]
      dataArr.push(arr)
    })
  
    const excelList = []
    excelList.push(headerStrList.join('\t,') + '\n')
    dataArr.forEach((item) => {
      excelList.push(item.join('\t,') + '\n')
    })
    const exportStr = excelList.join('')
    const uri = 'data:text/csv;charset=utf-8,\uFEFF' + encodeURIComponent(exportStr)
    const link = document.createElement('a')
    link.href = uri
    link.download = `${name}.csv`
    link.click()
  }

  /**
   * @description: 锚点定位
   * @param {string} idStr 元素的 id
   * @return {*}
   */
  anchorToPoint(idStr: string) {
    if (idStr && document.querySelector(idStr)) {
      ;(document.querySelector(idStr) as HTMLElement).scrollIntoView({
        behavior: 'smooth', // 定义动画过渡效果， "auto"或 "smooth" 之一。默认为 "auto"
        block: 'start', // 定义垂直方向的对齐， "start", "center", "end", 或 "nearest"之一。默认为 "start"
        inline: 'nearest', // 定义水平方向的对齐， "start", "center", "end", 或 "nearest"之一。默认为 "nearest"
      })
    }
  }
}
